/**
 * Created by 蓝景技术 on 2018/7/6.
 * webpack 生产配置文件
 */

const path = require('path');
const fs =require('fs')
const CopyWebpackPlugin = require("copy-webpack-plugin"); 		 //插件-拷贝文件
const VueLoaderPlugin = require('vue-loader').VueLoaderPlugin  //插件-vue-loader
const customConfig = require('./customConfig');                  //用户自定义配置
const MiniCssPlugin = require('mini-css-extract-plugin')		//插件-单独抽取CSS文件
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin'); //插件-压缩CSS
const UglifyJsPlugin = require("uglifyjs-webpack-plugin"); //插件-压缩js
//const tinyPngWebpackPlugin = require('tinypng-webpack-plugin') //[暂时废弃！没钱啊]tinypng压缩插件
// const ExtractTextPlugin = require("extract-text-webpack-plugin");//插件-单独抽取
// const merge = require('webpack-merge');                         //插件-合并配置
// const webpack = require("webpack");


//拷贝文件,不经过webpack处理的全部直接拷贝到目标目录
//需要提前做一下文件夹读取检验，如果没有static文件夹，则不执行copy插件
let copyPluginInstance = function(){} //默认空插件
try {
	fs.accessSync(path.resolve(__dirname,'../src/static'))
	copyPluginInstance = new CopyWebpackPlugin(
		[
			{
				from: path.resolve(__dirname, '../src/static'),
				to: path.resolve(__dirname, '../dist/static')
			}
		]
	)
} catch (err) {
	//console.error('出错信息:'+err)
}

//生产配置
const config = {
	mode: "production",// development production
	devtool: false, //'source-map'
	entry: customConfig.entry,
	output: {
		filename: 'js/[name].[chunkhash:8].js',
		path: path.join(__dirname, '../dist'),
		publicPath: customConfig.outputPublicPath
	},
	module: {
		rules: [
			{//json文件处理
				test: /\.json$/i,
				loader: "json-loader",
				include: /src/
			},
			{//css文件处理，并打包为独立一个css文件
				test: /\.css$/i,
				use: [
					MiniCssPlugin.loader,
					'css-loader',
					{
						loader: 'postcss-loader',
						options: {
							sourceMap: true,   //开启sourcemap，并沿用stylus-loader生成的sourcemap，增快编译速度
						}
					}
				]
			},
			{
				test: /\.scss$/i,
				include: /src/,
				use: [
					MiniCssPlugin.loader,
					'css-loader',
					{
						loader: 'postcss-loader',
						options: {
							sourceMap: true,   //开启sourcemap，并沿用stylus-loader生成的sourcemap，增快编译速度
						}
					},
					'sass-loader'
				]
			},
			{//js文件处理
				test: /\.js$/i,
				loader: "babel-loader",
				include: path.resolve(__dirname, "../src/js/"),
			},
			{//字体类型处理
				test: /\.(woff(2)?|eot|ttf|svg)(\?.*)?$/i,
				loader: 'url-loader',
				query: {
					limit: 1,
					name: 'assets/font/[name]-[hash].[ext]'
				}
			},
			{//正则匹配后缀.png、.jpg、.gif图片文件;
				test: /.*\.(gif|png|jpe?g|svg|webp)$/i,
				include: /src/,
				use: [
					{
						//加载url-loader 同时安装 file-loader;
						loader: 'url-loader',
						options: {
							limit: 102400,//小于100K的图片文件转base64到css里,当然css文件体积更大;
							name: 'assets/images/[name]-[hash:8].[ext]'//设置最终生成路径
						}
					},
					{
						loader: 'image-webpack-loader',
						options: {
							mozjpeg: { // 压缩 jpeg 的配置
								progressive: true,
								quality: 80
							},
							optipng: { // 使用 imagemin-optipng 压缩 png，enable: false 为关闭
								enabled: false,
							},
							pngquant: { // 使用 imagemin-pngquant 压缩 png
								quality: '65-90',
								speed: 4
							},
							gifsicle: { // 压缩 gif 的配置
								interlaced: false,
							},
							webp: { // 开启 webp，会把 jpg 和 png 图片压缩为 webp 格式
								quality: 75
							},
						}
					}
				]
			},
			{//vue文件处理
				test: /\.vue$/i,
				loader: "vue-loader",
				include: /src/,
				options: {
					// extractCSS: true		//单独把vue文件中的样式抽离出来
				}
			},
			{
			  test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/i,
			  loader: 'url-loader',
			  options: {
				limit: 10000,
				name: 'assets/media/[name].[hash:7].[ext]'
			  }
			}
		]
	},
	plugins: customConfig.plugins.concat([
		// vue-loader必备插件
		new VueLoaderPlugin(),
		//拷贝文件,不经过webpack处理的全部直接拷贝到目标目录
		copyPluginInstance,
		
		// 提取公共css文件
		new MiniCssPlugin({
			filename: 'assets/css/[name].[contenthash:8].css',
			chunkFilename: 'assets/css/[name].[contenthash:8].chunk.css'
		})
	]),
	//优化文件的配置,根据网站类型不同，这里设置回有所不同
	optimization: {
		//压缩文件的相关配置
		minimizer: [
			//JS压缩
			new UglifyJsPlugin({
				cache: true,
				parallel: true,
				sourceMap: true // set to true if you want JS source maps
			}),
			//CSS压缩
			new OptimizeCSSAssetsPlugin({})
		],
		//代码分离
		splitChunks: {
			cacheGroups: {
				//公共js
				commons: {
					name: 'common',
					chunks: 'all',
					minChunks: 1
				}
			}
		},
		//webpack的runtime代码分离
		runtimeChunk: { name: 'runtime' }
	},
	resolve: customConfig.resolve,
	externals: customConfig.externals

}
module.exports = config